<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>添加用户</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
      <script type="text/javascript" src="../../lib/jquery/jquery-3.0.0.min.js"></script>
      <script src="../../lib/layui/layui.js" charset="utf-8"></script>
      <script src="../../static/js/app.js"></script>
      <script src="../../static/js/eleDel.js" type="text/javascript" charset="utf-8"></script>
      <script src="../../static/js/common/optUtils.js"></script>
      <link rel="stylesheet" href="../../static/css/font.css">
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
      <link rel="stylesheet" href="../../static/css/weadmin.css">
      <link rel="stylesheet" href="../../lib/formselect/formSelects-v4.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body>
    <div class="weadmin-body">
        <form class="layui-form" id="FirstForm">
            <input id="id" name="id" type="hidden">
          <div class="layui-form-item">
              <label for="username" class="layui-form-label">
                  <span class="we-red">*</span>登录名
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="username" name="username" required="" lay-verify="required"
                  autocomplete="off" class="layui-input">
              </div>
              <div class="layui-form-mid layui-word-aux">
                  <span class="we-red">*</span>将会成为您唯一的登入名
              </div>
          </div>
          <div class="layui-form-item">
              <label for="phone" class="layui-form-label">
                  <span class="we-red">*</span>手机
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="phone" name="phone" required="" lay-verify="phone"
                  autocomplete="off" class="layui-input">
              </div>
          </div>
            <div class="layui-form-item">
                <label for="realname" class="layui-form-label">
                    <span class="we-red">*</span>姓名
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="realname" name="realname" required="" lay-verify="realname"
                           autocomplete="off" class="layui-input">
                </div>
            </div>
          <div class="layui-form-item">
              <label class="layui-form-label">
                  <span class="we-red">*</span>邮箱
              </label>
              <div class="layui-input-inline">
                  <input type="text" id="email" name="email" required="" lay-verify="email"
                  autocomplete="off" class="layui-input">
              </div>
              <div class="layui-form-mid layui-word-aux">
                  <span class="we-red">*</span>
              </div>
          </div>

          <div class="layui-form-item" id="psw">
              <label class="layui-form-label">
                  <span class="we-red">*</span>密码
              </label>
              <div class="layui-input-inline">
                  <input type="password" id="password" name="password" required="" lay-verify="pass"
                  autocomplete="off" class="layui-input">
              </div>
              <div class="layui-form-mid layui-word-aux">
                  6到16个字符
              </div>
          </div>
          <div class="layui-form-item" id="psw1">
              <label class="layui-form-label">
                  <span class="we-red">*</span>确认密码
              </label>
              <div class="layui-input-inline">
                  <input type="password" id="repassword" name="repassword" required="" lay-verify="repass"
                  autocomplete="off" class="layui-input">
              </div>
          </div>
           <div class="layui-form-item">
               <label class="layui-form-label"><span class="we-red">*</span>角色</label>
               <div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
                   <select id="roleId" name="roleId"  multiple="multiple" xm-select="select1" xm-select-search="" xm-select-search-type="dl"></select>
               </div>
           </div>
          <div class="layui-form-item">
              <button id="addbtn" class="layui-btn" lay-filter="add" lay-submit="">提交</button>
          </div>
      </form>
    </div>
		<script src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript">
        var act = GetUrlParam("act");
    		layui.extend({
					admin: '{/}../../static/js/admin'
				});

            layui.config({
                base: '../../lib/formselect/' //此处路径请自行处理, 可以使用绝对路径
            }).extend({
                formSelects: 'formSelects-v4.min'
            });
        layui.use(['form','layer','admin','jquery','laydate','formSelects'], function(){
            initRole();
          var form = layui.form,
          	admin = layui.admin,
              laydate=layui.laydate,
          	layer = layui.layer,
              formSelects = layui.formSelects,
          $=layui.jquery;
            if (act=='edit'){//修改用户
                //隐藏过多的数据
                $("#psw").hide();
                $("#psw1").hide();
                $("#username").attr("disabled","disabled");
                var roleIds="";
                var data1 =JSON.parse(sessionStorage.getItem('editRowData'));
                for (var o in data1){
                    if (o=="mobile"){
                        $("#phone").val(data1[o]);
                    } else {
                        $("#"+o).val(data1[o]);
                    }

                };
                //获取该角色的权限
                new APIRequest(
                    {
                        url: global.api_url + "/sysUser/getRoleByUser",
                        header: {content_type: "application/json;charset=UTF-8",Authorization:getUser().token},
                        data:{user_id:data1.id},
                        method: "Post",
                        async: false,
                        success: function (result) {
                            var data2=result.data;
                            for (var o in data2){
                                roleIds+=data2[o].roleId+',';
                            }
                        },
                        dataType: "json"
                    }
                );
                initRole(act,roleIds);
            }else {//添加角色
                initRole(act);
            }


            formSelects.render('selectId');
          	form.render();


          //监听提交
         $("#addbtn").on("click",function () {
             if (act!='edit'){
                 //自定义验证规则
                 form.verify({
                     username: function(value){
                         if(value.length < 5){
                             return '昵称至少得5个字符啊';
                         }
                     }
                     ,pass: [/(.+){6,12}$/, '密码必须6到12位']
                     ,repass: function(value){
                         if($('#repassword').val()!=$('#password').val()){
                             return '两次密码不一致';
                         }
                     }
                 });
             }
             form.on('submit(add)',function (data) {
                var f= data.field;
                if (act=='edit'){
                    new APIRequest(
                        {
                            url: global.api_url + "/sysUser/editUser",
                            header: {content_type: "application/json;charset=UTF-8",Authorization:getUser().token},
                            data:f,
                            method: "Post",
                            async: false,
                            success: function (result) {
                                parent.location.reload();//刷新父页面
                                parent.layui.admin.events.closeThisTabs();//关闭当前页面
                                layer.msg("更改用户成功");
                            },
                            dataType: "json"
                        }
                    );
                } else {
                    new APIRequest(
                        {
                            url: global.api_url + "/sysUser/addUser",
                            header: {content_type: "application/json;charset=UTF-8",Authorization:getUser().token},
                            data:f,
                            method: "Post",
                            async: false,
                            success: function (result) {
                                parent.location.reload();//刷新父页面
                                parent.layui.admin.events.closeThisTabs();//关闭当前页面
                                layer.msg("新增用户成功");
                            },
                            dataType: "json"
                        }
                    );
                }
                 return false;
             });
         })
        });
            function initRole(act,roleIds) {
                var htmls='<option value="">请选择</option> ';
                new APIRequest(
                    {
                        url: global.api_url + "/sysRole/selectAll",
                        header: {content_type: "application/json;charset=UTF-8",Authorization:getUser().token},
                        async: false,
                        success: function (result) {
                            var da=result.data.records;
                            var temflag=false;
                            for (var o in da){
                                temflag=false;
                                if (act=='edit'){
                                    var strs = roleIds.split(",");
                                    for (var i in strs){
                                        if (da[o].id==strs[i]){
                                            temflag=true;
                                            break;
                                        }
                                    }
                                    if (temflag){
                                        htmls+="<option value='"+da[o].id+"'  selected='selected'>"+da[o].sysRoleName+"</option>";
                                    } else {
                                        htmls+="<option value='"+da[o].id+"'>"+da[o].sysRoleName+"</option>";
                                    }
                                }else {
                                    htmls+="<option value='"+da[o].id+"'>"+da[o].sysRoleName+"</option>";
                                }
                            }
                            $("#roleId").html(htmls);
                        },
                        dataType: "json"
                    }
                );
            }

    </script>
  </body>

</html>